//把data中属性的属性加上getter\setter
class Observer {
    constructor(data) {
        this.walk(data)
    }
    walk(data) {
        if (!data || typeof data !== 'object') {
            return
        }
        // 2. 遍历data对象的所有属性
        Object.keys(data).forEach(key => {
            this.defineReactive(data, key, data[key])
        })
    }
    defineReactive(obj, key, val) {
        //data属性的属性转成响应式
        //console.log('0', this); // this是Observer对象
        let dep = new Dep()  //收集依赖，发送通知  //给每一个属性都创建一个dep对象

        const that = this
        this.walk(val)
        Object.defineProperty(obj, key, {
            enumerable: true,
            configurable: true,
            get() {

                // 收集依赖   收集依赖该属性的watcher,Dep.target存储的是观察者对象 watcher对象
                // 在实例化watcher之后才会有值,就会存到dep.target
                //dep.addSub(Dep.target)添加到dep.js的subs数组中
                Dep.target && dep.addSub(Dep.target)

                return val
            },
            set(newValue) {
                if (newValue === val) {
                    return
                }
                val = newValue
                //console.log(this);  //this是第一个参数data

                that.walk(newValue)  // data:{person:{name}}  name属性转换成响应式

                // 发送通知  数据发生变化的时候，通知dep，调用dep的update方法
                dep.notify()
            }
        })
    }
}